<div style="height: 630px;overflow: auto;">
    <p-tabView>
        <p-tabPanel header="基本信息">
            <div style="border: 1px solid #c7cdd9;margin-bottom: 20px;">
                <div [ngSwitch]="workflow">
                    <div *ngSwitchCase="">
                        <span class="m-loader m-loader--warning" style="width: 30px; display: inline-block;"></span>
                    </div>
                    <div *ngSwitchDefault>
                        <app-OutsourcingWorkFlowDetailForm [workflow]="workflow"></app-OutsourcingWorkFlowDetailForm>
                    </div>
                </div>
            </div>
        </p-tabPanel>

        <p-tabPanel header="申请内容">

            <div class="row" style="overflow: auto;">
                <div class="align-items-center">
                    <!--<Primeng-TurboTable-Start>-->
                    <div class="primeng-datatable-container" [busyIf]="primengTableHelper.isLoading">
                        <p-table #dataTable (onLazyLoad)="getOutsourings($event)" [value]="primengTableHelper.records"
                        rows="{{primengTableHelper.defaultRecordsCountPerPage}}"
                            [paginator]="false" [lazy]="true" [scrollable]="true" ScrollWidth="100%" [responsive]="primengTableHelper.isResponsive"
                            [resizableColumns]="primengTableHelper.resizableColumns">
                            <ng-template pTemplate="header">
                                <tr>
                                    <th style="width: 50px">
                                        序号
                                    </th>
                                    <th style="width: 150px">
                                        任务号
                                    </th>
                                    <th style="width: 150px">
                                        产品图号
                                    </th>
                                    <th style="width: 150px">
                                        产品名称
                                    </th>
                                    <th style="width: 150px">
                                        加工状态
                                    </th>
                                    <th style="width: 130px">
                                        交付进度
                                    </th>
                                    <th style="width: 100px">
                                        数量
                                    </th>
                                    <th style="width: 100px">
                                        参考单价
                                    </th>
                                    <th style="width: 100px">
                                        参考总价
                                    </th>
                                    <th style="width: 120px">
                                        备注
                                    </th>
                                </tr>
                            </ng-template>
                            <ng-template pTemplate="body" let-record="$implicit" let-ri='rowIndex'>
                                <tr>
                                    <th style="width: 50px">
                                        {{ri+1}}
                                    </th>
                                    <td style="width: 150px">
                                        {{record.taskCode}}
                                    </td>
                                    <td style="width: 150px">
                                        {{record.picNo}}
                                    </td>
                                    <td style="width: 150px">
                                        {{record.taskName}}
                                    </td>
                                    <td style="width: 150px">
                                        <!-- 加工状态 -->
                                        {{record.workStatus}}
                                    </td>
                                    <td style="width: 130px">
                                        <!-- 交付进度 -->
                                        {{record.deliveryRate | momentFormat:'L'}}
                                    </td>
                                    <td style="width: 100px">
                                        <!-- 数量 -->
                                        {{record.outsouringAmount}}
                                    </td>
                                    <td style="width: 100px">
                                        {{record.unitPrice}}
                                    </td>
                                    <td style="width: 100px">
                                        {{record.unitPrice * record.outsouringAmount}}
                                    </td>
                                    <td style="width: 120px">
                                        {{ record.remark }}
                                    </td>
                                </tr>
                            </ng-template>
                        </p-table>
                        <div class="primeng-no-data" *ngIf="primengTableHelper.totalRecordsCount == 0">
                            {{'NoData' | localize}}
                        </div>
                        <div class="primeng-paging-container">

                            <p-paginator [rows]="primengTableHelper.defaultRecordsCountPerPage" #paginator
                                (onPageChange)="getOutsourings($event)" [totalRecords]="primengTableHelper.totalRecordsCount"
                                [rowsPerPageOptions]="primengTableHelper.predefinedRecordsCountPerPage">

                            </p-paginator>
                            <span class="total-records-count">
                                {{'TotalRecordsCount' | localize:primengTableHelper.totalRecordsCount}}
                            </span>
                        </div>
                    </div>
                    <!--<Primeng-TurboTable-End>-->
                </div>
            </div>
        </p-tabPanel>
        <p-tabPanel header="审批记录">
            <app-flowApprovalRecord workflowid="{{workflowid}}"></app-flowApprovalRecord>
        </p-tabPanel>
        <p-tabPanel *ngFor="let item of tabPanels" header="{{item.title}} 报价单">
            <!-- <jhi-tabpage1></jhi-tabpage1> -->
            <!-- 直接写组件<jhi-tabpage1>可以正常渲染，但使用下面的动态{{}}就只渲染标签字符串 -->
            <div style="border: 1px solid #c7cdd9;">
                <awaitQuatationSupplier editEnable=true suppliername={{item.title}} workflowid="{{workflowid}}">
                </awaitQuatationSupplier>
            </div>
        </p-tabPanel>
    </p-tabView>
    <button type="button" class="btn btn-success " style="font-size: 0.5rem" (click)="exportToexcel()">
        <i class="far fa-file-excel"></i>
        导出报价单
    </button>
</div>
